<template>
	<view class="">
		<u-navbar :is-back="true" :border-bottom="false" title="图集规范" height="46" title-color="#333" :title-bold="true"
		 :title-size="36">
			<view class="navbar_wap">
				<view class="navbar-right">
					<u-icon name="search" color="#C40200" size="45" class="search_logo" @click="goSearch()"></u-icon>
					<u-icon name="scan" color="#C40200" size="45" @click="scancode"></u-icon>
				</view>
			</view>
		</u-navbar>

		<image src="../../../static/atlas/tujiguifan.jpg" mode="" class="atlas_img"></image>
		<u-tabs name="name" :list="atlasnav" :current="current" @change="change" :bar-width="100" active-color="#000000"
		 :bar-style="{backgroundColor:'#c40200',height:'5rpx',borderRadius: '5rpx',marginBottom:'-2rpx'}"></u-tabs>
		<atlas-nav :atlaslist="atlaslist" @child-event='Atlascont'></atlas-nav>
		<atlas-cont :atlascont="atlascont"></atlas-cont>
		<view class="atlas-block"></view>
		<u-loadmore status="没有更多数据" style="padding-top: 30rpx;" v-if="loadshow" />
	</view>

</template>

<script>
	import AtlasNav from "./childComps/AtlasNav.vue"
	import AtlasCont from "./childComps/AtlasCont.vue"
	export default {
		data() {
			return {
				keyword: '',
				atlasnav: [],
				current: 0,
				id: 0,
				atlaslist: [],
				atlascont: [],
				atlasnew: [],
				pagesize: 8,
				loadshow: false,
				params: {
					cmd: 'nFiles_list_proc',
					para: {
						pageindex: 1,
						pagesize: 40,
					}
				},

			}
		},
		async onLoad(options) {
			await this.getPrizesList();
			if (options.current) {
				this.current = options.current
			}
			// await this.atlasCist()
			await this.atlasList()
		},
		onReady() {

		},
		onReachBottom() {
			if (this.pagesize <= this.atlascont.length) {
				this.pagesize = this.pagesize + 8
				this.atlasCist(this.id)
			}
		},
		methods: {
			async getPrizesList() {
				const res = await this.$u.api.getPrizesList(this.params)
				this.atlasnav = res.Data.Datas1.filter(item => item.pid == 0);
				this.atlasnew = res.Data.Datas2
				for (var value of this.atlasnew.values()) {
					value.wjlx = this.baseUrl + value.wjlx
				}

			},
			async atlasList() {
				const res = await this.$u.api.getPrizesList(this.params)
				this.id = this.atlasnav[this.current].id
				this.atlaslist = res.Data.Datas1.filter(item => item.pid == this.id)
				console.log(this.atlaslist)
				for (var value of this.atlaslist.values()) {
					value.cshow = true;
					if (value.id == 1038 || value.id == 1077 || value.id == 1039 || value.id == 1030 || value.id == 1078 || value.id ==
						1069) {
						value.cshow = false
					}
				}
				this.atlasCist(this.id)
			},
			async atlasCist(index) {
				const res = await this.$u.api.getPrizesList({
					cmd: 'nFiles_list_proc',
					para: {
						pageindex: 1,
						pagesize: this.pagesize,
						colid: index
					}
				})
				this.atlascont = res.Data.Data
				for (var value of this.atlascont.values()) {
					value.wjlx = this.baseUrl + value.wjlx
				}

				if (this.pagesize > this.atlascont.length) {
					this.loadshow = true
				}
			},
			Atlascont(val) {
				this.pagesize = 8
				if (val != 1038 && val != 1039 && val != 1030 && val != 1077 && val != 1078 && val != 1069) {
					this.atlasCist(val)
				}
			},
			// 点击搜索框后的事件
			search(keyword) {

			},
			custom(keyword) {

			},
			// 点击分类切换数据
			change(index) {
				this.pagesize = 8
				this.current = index;
				this.atlasList()
			},
			scancode() {
				uni.scanCode({
					success: function(res) {
						console.log('条码类型：' + res.scanType);
						console.log('条码内容：' + res.result);
					}
				});
			},
			goSearch() {
				uni.navigateTo({
					url: "/pages/HomeLnner/search/search"
				})
			}
		},
		components: {
			"atlas-nav": AtlasNav,
			"atlas-cont": AtlasCont,
		}
	}
</script>

<style scoped lang="scss">
	.navbar_wap {
		width: 100%;
		display: flex;
		justify-content: flex-end;
		align-items: center;
		padding: 0 30rpx;

		.navbar-right {
			.search_logo {
				margin-right: 30rpx;
			}
		}
	}

	/deep/.u-tab-item {
		line-height: 70rpx !important;
	}

	.atlas_img {
		width: 100vw;
		height: 320rpx;
	}

	.atlas-block {
		width: 100vw;
		height: 20rpx;
		background: #F7F7F7;
	}

	.special-text {
		padding: 38rpx 30rpx 0 30rpx;
		font-size: 34rpx;
		font-weight: bold;
		color: #000000;
	}
</style>
